$display:flex;
$column:column;
$around : space-around;
$background : rgba(255, 255, 255);
$center : center;
*{margin: 0;padding: 0; list-style: none;}
body{
    width: 100%;
    height: 100%;
    display: $display;
    justify-content: space-around;
    
    background-color: rgb(206, 215, 212);
}
#box2-2{
    width: 100%;
    height: 37.5rem;
    background-color: $background;
}
.box{
    width: 99%;
    height: 100%;
    display: $display;
    flex-direction: $column;
    justify-content: space-around;
    background-color: $background;
    
}
.box1{
    width: 90%;
    height: 30%;
    display: $display;
    justify-content: $center;
    flex-direction: $column;
    background-color: $background;
    margin-bottom: 1.875rem;
}
.box1-1{
    width: 31.25rem;
    height:5rem;
    display: $display;
    flex-flow: row nowrap;
    align-items: $center;
    justify-content: $around;
    line-height:5rem;
    background-color: $background;
}
.box1-2{
    width: 100%;
    height: 12.5rem;
    display: $display;
    justify-content: $around;
    flex-wrap: nowrap;
    flex-direction: row;
    background-color: $background;
}
.lj,.fw,.ff,.ls{
    width: 22%;
    height: 11.25rem;
    background-color: rgb(248, 248, 248);
    display: $display;
    justify-content: $center;
    align-items: $center;
}
.lj-img,.fw-img,.ff-img,.ls-img{
    width: 3.125rem;
    height: 3.125rem;
    z-index: 1;
    display: $display;
    img{
        width: 100%;
    }
}
.lj-txt,.fw-txt,.ff-txt,.ls-txt{
    width: 12.5rem;
    height: 6.25rem;
    display: $display;
    flex-direction: $column;
    justify-content:$center;
    align-items: $center;
    p{
        display: block;
        height: 2.5rem;
    }
}
.box2{
    width: 100%;
    height: 100%;
    display: $display;
    justify-content: $center;
    flex-direction: $column;
    background-color: $background;
}
.box2-1{
    width: 100%;
    height: 3.125rem;
    display: $display;
    justify-content:$around;
    align-items: $center;
    background-color: $background;
}
.lj-h4,.fw-h4,.ff-h4,.ls-h4{
    font-size: 1.875rem;
}
.date{
    width: 18.75rem;
    display: flex;
    justify-content: center;
}
#date{
    width: 12.5rem;
    text-align: $center;
    font-size: 1rem;
}
.ul{
    width: 12.5rem;
    li{
        width: 1.875rem;
        height: 1.875rem;
        display: block;
        float: left;
        border: 1px solid #999;
        text-align: center;
    }
}

@media only screen and(max-width: 888px){
    // body, div,box2, span, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li,#box2-2,.box2, pre, canvas, form, fieldset, legend, button, input, textarea, th, td {
    //     width: 100%;
    //     margin: 0;
    //     padding: 0;
    // }
    .box1-2{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        height:40%;
        .ls{
            width: 250px;
            z-index: 100000;
            margin: 5px;
        }
        

        
       }
    // #zr_0{
    // width: 100% !important;

    // }
}

